<template>

	<view>
		<view class="content">
			<view class="userlist">
				
				<view class="uli-box" v-for="(item,index) in userlists">
					<view class="ul-item" >
						<view class="uli-avatar">
							<image :src="item.headimg"></image>
						</view>
						<view class="uli-info">
							<view class="uli-nick">{{item.nickname}}</view>
							<view class="uli-sex">{{item.tel}}</view>
						</view>
						<view class="ops">
							<view class="ops-btn" @tap="set_main(item.id)">训练大纲</view>
							<view class="ops-btn" @tap="set_eval(item.id)">训练评估</view>
						</view>
					</view>
					<view class="sep"></view>
				</view>
				

			</view>
		</view>
	</view>

</template>

<script>
	
	var app = getApp();
	
	export default {
		data() {
			return {
				userlists:[]
			}
		},
		onLoad() {
			let that = this;
			that.get_userlists();
		},
		methods: {
			get_userlists(){
				let that = this;
				
				app.get('ApiYuyueOrder/get_orderusers',{},(resp)=>{
					if(resp.status == 200){
						that.userlists = resp.msg;
					}else{
						app.alert(resp.msg);
					}
					
				});
				
			},
			set_main(user_id){
				app.goto('/activity/yuyue/orderuser_main?user_id='+user_id);
			},
			set_eval(user_id){
				app.goto('/activity/yuyue/orderuser_eval?user_id='+user_id);
			}
		}
	}
</script>

<style>

.userlist{
	padding: 0.25rem;
}

.uli-box{
	height: auto;
}

.ul-item{
	height: 2.5rem;
	display: flex;
	flex-direction: row;
	margin-bottom: 0.25rem;
}

.sep{
	height: 0.01rem;
	background-color: #e5e5e5;
	width: 100%;
	margin-bottom: 0.25rem;
}

.uli-avatar{
	height: 2.5rem;
	width: 2.5rem;
	flex-shrink: 0;
	margin-top: 0.1rem;
	margin-left: 0.3rem;
}

.uli-avatar image{
	height: 100%;
	width: 100%;
}

.uli-info,
.uli-sex{
	width: 100%;
	flex-direction: column;
	color: #5d5d5d;
	margin-left: 0.25rem;
}

.uli-nick{
	height: 1.25rem;
	line-height: 1.25rem;
	text-align: left;
}

.ops{
	display: flex;
	flex-direction: row;
	width: 10rem;
}

.ops-btn{
	width: 4.5rem;
	text-align: center;
	background-color: #00aaff;
	color: white;
	height: 2.0rem;
	line-height: 2.0rem;
	margin-top: 0.35rem;
	border-radius: 0.25rem;
	margin-right: 0.5rem;
	flex-shrink: 0;
}

.ops-btn:active{
	background-color: #0081c1;
}

</style>